<h1 class="text-2xl font-bold mb-6"><%= @service.friendly_name %></h1>
<h6 class="text-xl font-bold">Storage</h6>
<div class="mb-4">
  <%= render(
    "shared/partials/async_renderer",
    view_model: Async::Helm::StorageViewModel.new(
      current_user,
      add_on_id: @add_on.id
    )
  ) %>
</div>
<h6 class="text-xl font-bold">Created</h6>
<div class="mb-4">
  <%= @add_on.created_at.to_formatted_s(:long_ordinal) %>
</div>
<h6 class="text-xl font-bold"><%= @service.friendly_name %> Version</h6>
<div class="mb-4">
  <%= render(
    "shared/partials/async_renderer",
    view_model: Async::Helm::VersionViewModel.new(
      current_user,
      add_on_id: @add_on.id
    )
  ) %>
</div>

<h6 class="text-xl font-bold">Configuration</h6>
<div class="mb-4">
  <%= render(
    "shared/partials/async_renderer",
    view_model: Async::Helm::ValuesYamlViewModel.new(
      current_user,
      add_on_id: @add_on.id
    )
  ) %>
  <div class="mt-4">
    <%= link_to "Edit values.yaml", edit_add_on_path(@add_on), class: "btn btn-sm btn-outline-secondary" %>
  </div>
</div>
<% if @service.respond_to?(:internal_url) %>
  <h6 class="text-xl font-bold">Connection Details</h6>
  <div class="mb-4">
    <label for="postgresql-password" class="form-label">Connection URL</label>
    <div class="flex flex-row" data-controller="toggle-password">
      <input type="password" id="redis-password" name="redis-password" class="input input-bordered w-full max-w-lg focus:outline-offset-0" value="<%= @service.internal_url %>" data-toggle-password-target="input">
      <button class="btn btn-outline-secondary" type="button" data-action="click->toggle-password#toggle">
        <iconify-icon icon="lucide:eye"></iconify-icon>
      </button>
    </div>
  </div>
<% end %>